<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="keywords" content="data,global data,data catalog" />
  <title>Demo 3 of Keyword Highlight Plugin</title>
  <link type="text/css" rel="stylesheet" media="all" href="demo.css"/>

  <link type="text/css" rel="stylesheet" media="all" href="../css/plugin.css"/>
  <style>
	 .ex-plugin-keyword {
		text-decoration: none;
		border-bottom: dotted 1px black;
	}

	.ex-plugin-popup-window {
		border: 7px solid rgba(127,41,126,0.3);
	}
		
	.ex-plugin-triangle .bor{
		border-color: #7F297E transparent transparent transparent;
	}
	.ex-plugin-triangle-top .bor{
		border-color: transparent transparent #7F297E transparent;
	}
  </style>
  <script type="text/javascript" src="../js/plugin.js"></script>
  <script type="text/javascript">
   /* <![CDATA[ */
		$hl_plugin.setup({
			selector: "keyword", 
			mode: "first", 
			case_sen: false, 
			style: {color: "#7F297E"},
			pop_event: "click",
			resource_url: 'http:///hl-demo-for-worldbank.appspot.com/js/resource.json',
		});
	 /* ]]> */
 </script>

  </head>
  <body> 
	  <p class="intro">Demo 3</p>
	  <h4>User code:</h4>
	  <pre class="code">
	  &lt;link type="text/css" rel="stylesheet" media="all" href="../css/plugin.css"/&gt;
	  &lt;script type="text/javascript" src="../js/plugin.js"&gt;&lt;/script&gt;
	  &lt;script type="text/javascript"&gt;
			$hl_plugin.highlight({
				selector: "keyword", 
				mode: "first", 
				case_sen: false, 
				style: {color: "#7F297E"},
				pop_event: "click",
				resource_url: 'http:///hl-demo-for-worldbank.appspot.com/js/resource.json',
			});
	 &lt;/script&gt;
	  </pre>
	  <h4>Keywords to hightlighted are given by user, infomation show when keywords are clicked</h4>
	  <div class="origin">
	  <p>Asia has the third largest nominanl GDP of all continents, after North America and Europe,[citation needed] but the largest when measured in PPP. As of 2010, the largest economies in Asia are <keyword>China</keyword>, Japan, India, <keyword>South Korea</keyword> and Indonesia.<br/><br/>
	  Founded in 1893, Novosibirsk is the largest city in Siberia, with a population of about 1.5 million.<br/><br/>
	  In the late 1990s and early 2000s, the economies of the PRC[36] and India have been growing rapidly, both with an average annual growth rate of more than 8%. Other recent very high growth nations in Asia include <keyword>Malaysia</keyword>, the Philippines, <keyword>Pakistan</keyword>, Thailand, <keyword>Vietnam</keyword>, Mongolia, Uzbekistan, <keyword>Cyprus</keyword>, and mineral-rich nations such as Kazakhstan, <keyword>Turkmenistan</keyword>, Iran, Brunei, <keyword>United Arab Emirates</keyword>, Qatar, Kuwait, Saudi Arabia, Bahrain and Oman.<br/><br/>
	  China was the largest and most advanced economy on earth for much of recorded history,[37][38][39][40] until the British Empire (excluding India) overtook it in the mid 19th century.<keyword> Japan</keyword> has had for only several decades after WW2 the largest economy in Asia and second-largest of any single nation in the world, after surpassing the Soviet Union (measured in net material product) in 1986 and Germany in 1968. (NB: A number of supernational economies are larger, such as the European Union (EU), the North American Free Trade Agreement (NAFTA) or APEC).<br/><br/>
	  In the late 1980s and early 1990s, Japan's GDP was almost as large (current exchange rate method) as that of the rest of Asia combined.[citation needed] In 1995, Japan's economy nearly equaled that of the <keyword>USA</keyword> to tie as the largest economy in the world for a day, after the Japanese currency reached a record high of 79 yen/dollar. Economic growth in Asia since World War II to the 1990s had been concentrated in Japan as well as the four regions of South Korea, Taiwan, Hong Kong and <keyword>Singapore</keyword> located in the Pacific Rim, known as the Asian tigers, which have now all received developed country status, having the highest GDP per capita in Asia.[41]<br/><br/>
	  It is forecasted that India will overtake Japan in terms of nominal GDP by 2020.[42] In terms of GDP per capita, both nominal and PPP-adjusted, South Korea will become the second wealthiest country in Asia by 2025, overtaking Germany, the United Kingdom and <keyword>France</keyword>. By 2027, according to Goldman Sachs, China will have the largest economy in the world.
	  </p>
			</div>

	 <table class="origin"  border=0 cellpadding=0 cellspacing=0><tr><td><keyword>Czech Republic</keyword></td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>Denmark</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>9</td><td>9</td></tr><tr><td><keyword>Ecuador</keyword></td><td>9</td><td>NA</td><td>X</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td></tr><tr><td>Estonia</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>9</td><td>9</td></tr><tr><td>Finland</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>France</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td><keyword>Germany</keyword></td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>Greece</td><td>X</td><td>X</td><td>9</td><td>9</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>Guatemala</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td></tr><tr><td><keyword>Hong Kong SAR</keyword></td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>Hungary</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>NA</td><td>X</td><td>NA</td></tr><tr><td>Iceland</td><td>9</td><td>9</td><td>X</td><td>X</td><td>9</td><td>9</td><td>X</td><td>X</td></tr><tr><td>Indonesia</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td></tr><tr><td>Ireland</td><td>9</td><td>9</td><td>X</td><td>X</td><td>NA</td><td>NA</td><td>NA</td><td>NA</td></tr></table>
  </body>

</html>
